<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>购物车</title>
    <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">

    <link rel="stylesheet" href="../../css/mui.css">
    <link rel="stylesheet" href="../../css/mycss/billList.css">
</head>
<style>
    .person-info div{
        border-bottom: 1px solid #F8F8FF;
    }
    /*修改多选框颜色 */
    .mui-checkbox input[type='checkbox']:checked:before
    {
        color: rgb(254,0,89);
    }
</style>
<body style="background-color: rgb(236,239,243);max-width: 414px;margin: auto;">

<header id="header" class="mui-bar mui-bar-nav" style="max-width: 414px;margin: auto;background-color:rgb(0,145,219);">
    <a style="color: white; " class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
    <!--<div  class="l"></div>-->
    <div class="mui-title" style="color: white;text-align: left;margin-left: 20px">评价晒单</div>
</header>

<div class="mui-content"  style="text-align: center">
    <!--<div class="comment-list">-->
        <!--<div class="selectLevel" style="background-color: white;width: 100%;height: 120px;margin-top: 10px;padding: 20px;">-->
            <!--<div class="goods-img" style="	border: 1px solid #F8F8FF;border-radius:5px 5px 5px 5px;width: 80px;height: 80px;float: left;">-->
                <!--<img src="../../images/abc.png"  style="	border: 1px solid ghostwhite;border-radius: 5px 5px 5px 5px;;width: 80px;height: 80px;">-->
            <!--</div>-->
            <!--<div style="float:left;height: 30px;padding: 10px 0 0 0;margin-left: 20px;font-weight: 500;width: 40%">评价</div>-->
            <!--<div style="height: 40px;float: left;margin-top: 10px;margin-left: 10px;">-->
                <!--<img style="float: left;margin-left: 10px;width: 20px;" src="../../images/hongxing.png">-->
                <!--<img style="float: left;margin-left: 10px;width: 20px;" src="../../images/hongxing.png">-->
                <!--<img style="float: left;margin-left: 10px;width: 20px;" src="../../images/hongxing.png">-->
                <!--<img style="float: left;margin-left: 10px;width: 20px;" src="../../images/hongxing.png">-->
                <!--<img style="float: left;margin-left: 10px;width: 20px;" src="../../images/baixing.png">-->
            <!--</div>-->
        <!--</div>-->

        <!--<div class="comment-content">-->
            <!--&lt;!&ndash;评价一下<textarea style="BORDER-BOTTOM: 0px solid; BORDER-LEFT: 0px solid; BORDER-RIGHT: 0px solid; BORDER-TOP: 0px solid;" rows="5" placeholder="请输入简历"></textarea>&ndash;&gt;-->
            <!--<div style="background-color: white;margin-top: 10px;padding: 10px;">-->
                <!--<div class="mui-input-row" style="height:150px;"><label style="font-weight: bold">评价一下：</label>-->
                    <!--<textarea class="hcqk" class="form" rows="5" placeholder="评价晒图即可得小普币哦！"></textarea>-->
                <!--</div>-->
            <!--</div>-->
        <!--</div>-->

        <!--<div class="mui-row" style="background-color: white">-->
            <!--<div class="mui-col-xs-3" style="margin-left: 20px;">-->
                <!--<img style="width: 100%;" src="../../images/abc.png" />-->
            <!--</div>-->
            <!--<div class="mui-col-xs-3" style="margin-left: 20px;">-->
                <!--<label><img style="width: 100%;" src="../../images/pic.png" />-->
                    <!--<input style="opacity: 0;" type="file" accept="image/*" multiple />-->
                <!--</label>-->
            <!--</div>-->
        <!--</div>-->
    <!--</div>-->

    <div class="comment-list">
        <div class="selectLevel" style="background-color: white;width: 100%;height: 120px;margin-top: 10px;padding: 20px;">
            <div class="goods-img" style="	border: 1px solid #F8F8FF;border-radius:5px 5px 5px 5px;width: 80px;height: 80px;float: left;">
                <img src="../../images/abc.png"  style="	border: 1px solid ghostwhite;border-radius: 5px 5px 5px 5px;;width: 80px;height: 80px;">
            </div>
            <div style="float:left;height: 30px;padding: 10px 0 0 0;margin-left: 20px;font-weight: 500;width: 40%">评价</div>
            <div style="height: 40px;float: left;margin-top: 10px;margin-left: 10px;">
                <img style="float: left;margin-left: 10px;width: 20px;" src="../../images/hongxing.png">
                <img style="float: left;margin-left: 10px;width: 20px;" src="../../images/hongxing.png">
                <img style="float: left;margin-left: 10px;width: 20px;" src="../../images/hongxing.png">
                <img style="float: left;margin-left: 10px;width: 20px;" src="../../images/hongxing.png">
                <img style="float: left;margin-left: 10px;width: 20px;" src="../../images/baixing.png">
            </div>
        </div>

        <div class="comment-content">
            <!--评价一下<textarea style="BORDER-BOTTOM: 0px solid; BORDER-LEFT: 0px solid; BORDER-RIGHT: 0px solid; BORDER-TOP: 0px solid;" rows="5" placeholder="请输入简历"></textarea>-->
            <div style="background-color: white;margin-top: 10px;padding: 10px;">
                <div class="mui-input-row" style="height:150px;"><label style="font-weight: bold">评价一下：</label>
                    <textarea class="hcqk" class="form" rows="5" placeholder="评价晒图即可得小普币哦！"></textarea>
                </div>
            </div>
        </div>

        <div class="mui-row" style="background-color: white">
            <div class="mui-col-xs-3" style="margin-left: 20px;height:100px;overflow: hidden">
                    <img style="width: 100%;" src="../../images/abc.png" />
            </div>
            <div class="mui-col-xs-3" style="margin-left: 20px;height:100px;overflow: hidden">
                <img style="width: 100%;" src="../../images/abc.png" />
            </div>
            <div class="mui-col-xs-3 addImg" style="margin-left: 20px;height:100px;">
                <label><img class="addShow" style="width: 100%;" src="../../images/pic.png" />
                <input id="file_input" style="opacity: 0;" type="file" accept="image/*" multiple />
                </label>
            </div>
        </div>
    </div>


    <div style="height: 40px;margin-top: 10px;background-color: white">
        <div class="mui-input-row mui-left mui-checkbox mui-pull-left cart-checked">
            <label>匿名评价</label>
            <input  type="checkbox" checked>
        </div>
    </div>

    <button style=";width:80%;height: 50px;margin-top: 30px;background-color: rgb(254,0,89);color:white;font-size: 16px">提交</button>

</div>


<script src="../../js/mui.js"></script>
<!--   引入jQuery  -->
<script type="text/javascript" src="../../js/myjs/commonjs/jquery-1.9.1.min.js"></script>

<script type="text/javascript">
    var input = document.getElementById("file_input");
    var result,div;

    input.addEventListener('change',readFile,false);
    function readFile() {
        for (var i = 0; i < this.files.length; i++) {
            if (!input['value'].match(/.jpg|.gif|.png|.bmp/i)) {　　//判断上传文件格式
                return alert("上传的图片格式不正确，请重新选择")
            }
            var reader = new FileReader();
            reader.readAsDataURL(this.files[i]);
            reader.onload = function (e) {
                result = ' <div class="mui-col-xs-3" style="margin-left: 20px;height:100px;"><img style="width: 100%;height:100px;" src="'+this.result+'" /></div>';
                jQuery('.addImg').before(result);
            }
        }
    }
</script>
<!--<script src="../../js/mui.picker.min.js"></script>-->
<script src="../../js/myjs/url.js"></script>
<!--<script src="./upload/src/lib/mobileFix.mini.js?v=ad62f13"></script>-->
<!--<script src="./upload/src/lib/exif.js?v=dd609b9"></script>-->
<!--<script src="./upload/dist/lrz.mobile.min.js?v=3d33fcf"></script>-->
<!--<script src="./upload/dist/index.js?v=c970150"></script>-->
</body>

</html>